// import React,{useState,useEffect,useRef,useCallback, useMemo,useContext,createContext} from 'react'
 // import { useSelector,useDispatch } from 'react-redux'
// import TestUseCallBack from './page/children/testUseCallBack'
// import TestUseReducer from './page/children/testUseReducer'
// import TestUseRef from './page/children/testUseRef'
// import TestUseMemo from './page/children/testUseMemo'
// import TestUseContext from './page/children/testUseContext'
// import { decrement, increment, refresh } from './page/react-redux/components/useInfo'
// import store from './page/react-redux/store'
// export default function App() {
  
//   // const [count,setCount] = useState(0)
//   const count = useSelector((state:any) => state.counter.value)
//   const [childCount,setChildCount] = useState(0)
//   const [memoNumber,setMemoNumber] = useState(0)
//   const [contextNumber,setContextNumber]:any = useState(0)
//   const dispatch = useDispatch()
//   const refreshChild = useCallback(()=>{
//     setChildCount(store.getState().counter.value)
//     unsubscribe()
//   },[childCount])
//   // ref测试
//   const testRef = useRef(null)

//   let currentValue:any;
//   function handleChange() {
//     const previousValue:any = currentValue
//     currentValue = store.getState()
//     if (previousValue && previousValue.counter !== currentValue.counter) {
//     } 
//   }
//   const unsubscribe = store.subscribe(handleChange)
//   function clickHaveChild(){
//     testRef.current
//     console.log(testRef.current)
//   }
//   const changeMemo = useMemo(()=>{
//     return memoNumber + 1
//   },[memoNumber])

//   interface Styles{
//     background:string,
//     width:string,
//     height:string,
//     margin:string
//   }
//   const style:Styles = {
//     background:'red',
//     width:'400px',
//     height:'200px',
//     margin:'20px'
// }
//   const ContextStyle = createContext(style)


//   return (
//     <div>
//       <p>{count}</p>
//       <button onClick={()=>dispatch(increment())}>+</button>
//       <button onClick={()=>dispatch(decrement())}>-</button>
//       <button onClick={()=>dispatch(refresh(5))}>重置</button>
//       <button onClick={refreshChild}>子数组的按钮</button>
//       <div>分割线---------------------------------</div>
//       <TestUseCallBack childCount={childCount}></TestUseCallBack>
//       <div>割---------------------------------</div>
//       <TestUseReducer></TestUseReducer>
//       <div>割---------------------------------</div>
//       <TestUseRef ref={testRef}></TestUseRef>
//       <button onClick={clickHaveChild}>点击获取testRef的子组件的值</button>
//       <div>割---------------------------------</div>
//       <TestUseMemo useNumber={changeMemo}></TestUseMemo>
//       <button onClick={()=> setMemoNumber(memoNumber => memoNumber +1 )}>Memo+++++++++</button>
//       <div>割---------------------------------</div>
//       <span>父组件点击数量：{contextNumber}</span>
//       <ContextStyle.Provider value={style}>
//          <TestUseContext></TestUseContext>
//       </ContextStyle.Provider>
//       <button onClick={() => setContextNumber((contextNumber:number) => contextNumber+1)}></button>
//     </div>
//   )
// }







import React from 'react'
import AppContext  from './page/useContext/style'
import TestUseContext from './page/children/testUseContext'
export default function App() {
  return (
    <AppContext.Provider value={null}>
      <div>
        父
        <TestUseContext></TestUseContext>
      </div>
    </AppContext.Provider>
  )
}

